<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <title>用户手机号码登录</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <script type="text/javascript" src="/assets/login/lib/iframe-resizer-3.6.3/iframeResizer.contentWindow.min.js"></script>
  <link href="/sitefiles/assets/lib/elementui/default/index.css" rel="stylesheet" type="text/css" />
  <link href="/sitefiles/assets/css/element-ui.css" rel="stylesheet" type="text/css" />
</head>

<body>
  <div id="main">
    <template v-if="pageType === 'form'">

      <el-form size="medium" ref="form" :model="form" label-width="100px" style="margin-top: 15px;">

        <el-form-item label="手机号码" prop="mobile" :rules="[
          { required: true, message: '请输入手机号码' },
          { validator: utils.validateMobile, message: '请输入有效的手机号码' }
        ]">
          <el-input v-model="form.mobile" placeholder="请输入手机号码" autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="短信验证码" prop="code" :rules="[{ required: true, message: '请输入短信验证码' }]">
          <el-input v-model="form.code" autocomplete="off" placeholder="请输入短信验证码">
            <template slot="append">
              <el-link type="primary" :underline="false" v-on:click.prevent="btnSendSmsClick">获取验证码</el-link>
            </template>
          </el-input>
        </el-form-item>
        
      </el-form>

      <el-row style="text-align: center;">
        <el-divider></el-divider>
        <div style="height: 10px"></div>
        <el-button type="primary" size="medium" v-on:click="btnSubmitClick">登 录</el-button>
        <div style="height: 10px"></div>
      </el-row>

    </template>
    <template v-else-if="pageType === 'success'">

      <div role="alert" class="el-alert el-alert--success is-light" style="padding: 15px">
        <i class="el-alert__icon el-icon-success is-big"></i>
        <div class="el-alert__content">
          <span class="el-alert__title is-bold">
            {{ user.displayName }} 欢迎回来
          </span>
        </div>
      </div>

    </template>
    <template v-else>
      <el-row style="margin-top: 100px; text-align: center">
        <img src="/assets/login/images/loading.gif" />
        <p>载入中，请稍后...</p>
      </el-row>
    </template>
  </div>
</body>

</html>

<script src="/sitefiles/assets/lib/es6-promise.auto.min.js" type="text/javascript"></script>
<script src="/sitefiles/assets/lib/axios-0.17.1.min.js" type="text/javascript"></script>
<script src="/sitefiles/assets/lib/core-js-3.6.5.min.js" type="text/javascript"></script>
<script src="/sitefiles/assets/lib/lodash-4.17.10.min.js" type="text/javascript"></script>
<script src="/sitefiles/assets/lib/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="/sitefiles/assets/lib/vue-2.5.16.min.js" type="text/javascript"></script>
<script src="/sitefiles/assets/lib/elementui/index.js"></script>
<script src="/sitefiles/assets/js/plugin.js" type="text/javascript"></script>
<script src="/sitefiles/assets/js/utils.js" type="text/javascript"></script>
<script src="/assets/login/login-mobile.js" type="text/javascript"></script>
